<template>
  <el-row :gutter="5"
          class="m-header" >
    <el-col :span="5" style="width: auto; margin-right: 15px;">
      <div class="grid-content bg-purple">
        <geo />
      </div>
    </el-col>
    <el-col :span="6">
      <div class="grid-content bg-purple">
        <user />
      </div>
    </el-col>
    <el-col :span="13" style="float: right;">
      <nav-bar></nav-bar>
    </el-col>
  </el-row>
</template>
 
<script lang='ts'>
import { Component, Vue } from "vue-property-decorator";
import Geo from "./geo.vue";
import User from "./user.vue";
import NavBar from "./nav.vue";
@Component({
  components: {
    Geo,
    User,
    NavBar,
  }
})
export default class MyHeader extends Vue {}
</script>
<style lang='scss'>
@import '@/assets/css/public/layout.scss';
@import '@/assets/css/public/header.scss';

</style>